# 自动检测页面缺失依赖及自动测试页面是否报错
# 背景
因做首页优化时，去除了许多非首页的依赖文件，导致单独打开某些页面时会报错。原因是以前首页加载了其需要的依赖，而该组件自己并没有写上所有需要的依赖文件到deps中，所以导致的报错。
于是通过两种方式来解决这类问题：
- 扫描所有文件需要的依赖，并补上
- 自动测试打开页面是否报错
# 扫描所有文件需要的依赖
那么怎么扫描组件需要的依赖呢？
# 思路
这里通过node.js扫描页面、业务组件文件夹中的所有js文件，
通过正则：
/((B|SFX)(\.[a-zA-Z1-9]+)+)/g
匹配出B.xx.xx以及SFX.xx.xx的依赖名字，
排除掉无需新写的依赖（首页加载过、是注释了的等情况），（其中通过gulp打包压缩去掉了注释后再扫描）。
且该依赖文件实际存在，
通过这一系列排除，剩下的就是需要添加的。
# 问题
做完就来实验，通过node.js自动将依赖写入到deps文件中后，发现存在组件相互引用的，导致需要的依赖被提前加载。
该问题因时间有限，所以暂时没做处理，采用折中的办法：
只添加未写入依赖的公共组件，讲道理业务组件应该是有写的。
# 结果
通过扫描并添加缺失的公共组件依赖，解决了一部分页面报错。
源码见附件。
# 自动测试页面是否报错
因为还是存在页面报错，于是诞生了自动测试的想法。
# 思路
# 获取需要测试的页面路径
最开始是通过遍历导航栏的路由来获取所有页面，但是需要区分不同页面（控制器、交换机等）来获取路由。测试需要打开不同页面去测试。
后来发现在控制器中，搜索栏功能有记录所有能访问的页面，于是可以实现执行一次测试命令即跑完所有页面。
# 打开测试页面
最开始是照着项目中已有的打开页面逻辑，通过window.open来打开新页面，但是这种方法存在不少缺陷：
- 浏览器自动获取焦点到新开tab上，测试期间无法处理别的事务。
- 同时测试多个页面效果不佳。因为浏览器对非活动的tab页面有限制，导致加载缓慢。
于是改用iframe的方式。
通过js在当前页面动态创建出iframe，并将页面路径赋予它，即可解决上面所说的问题。
# 如何记录报错页面
通过翻看源码，知道了页面加载都是在
SF.framework.DeferPageWrap.prototype.delayLoadPage
SF.framework.DeferPageWrap.prototype.compositePage
这两函数处理。
通过重写，判断当前在执行测试时，就记录报错。
# 如何自动跑起来
初始化测试命令的时候，会记录所有需要跑的页面（对搜索栏的数据加了去重），以及跑了的页面的数量索引。
然后还是在上面两个函数中，加载完页面后，取出下一个页面，并移除上一个页面的iframe。
在判断都跑完后，弹窗显示耗时以及错误页面的名字、链接，方便打开。
# 使用
# 步骤
思路讲完了，说说如何使用。
- 打开控制器首页
- f12打开控制台
- 输入
SF.invoke('testPages') - 如果碰到意外停止的情况，可以通过控制台找到对应的iframe，改下它的src再改回来即可。
# 一些配置项
可以通过SF.invoke('testPages', options)改变一些配置。
options为对象{}
| 配置项 | 类型 | 说明 |
|---|---|---|
| debugMode | boolean | 是否开始debug模式，开启则用debug模式打开页面 |
| maxFrameNum | number | 同时打开多少个iframe窗口，默认2，不建议太多，实测2个与4个耗时一样，且越多会导致页面加载意外报错 |
| storeKey | string | 存储报错数据的key，一般无需修改 |
# 对报错的修改方法
一般就是以下几种问题：
提示 “加载页面出错，请检查网络连接是否正常。”
这种是catjs返回的组件在执行时报错了，可以将返回的代码复制出来在控制台中执行，查看VMxxx的报错，就能看到是哪个文件报错了。补上依赖一般就好了。
提示 “页面初始化及布局出错!”
这种一般是页面报错了，通过在
SF.framework.DeferPageWrap.prototype.compositePage函数中打断点，查看报错信息进行解决。提示 xtype ...报错
表格用的xtype的组件没写入到依赖，在报错调用栈中打断点，找出出错的xtype，然后通过
ext.reg('某个xtype')（找不到时切换单双引号）找出该文件，写入依赖即可。
# 总结
通过以上两种方法，解决了首次打开页面报错的问题。
并且是自动化的，大大缩短了测试时间（两百多个页面，手工测一遍起码需要一小时，通过自动测试，几分钟就能跑完一遍，并给出报错页面名单）。